<template>
  <van-dialog v-model="isShow" title="确定取消订单？" show-cancel-button class="orderCancel" :before-close="onBeforeClose">
    <div v-if="Show">
    <div class="mb15 title isRequired">退回原因</div>
    <van-field
      class="textarea"
      v-model="message"
      rows="2"
      autosize
      border
      type="textarea"
      maxlength="50"
      placeholder="请输入订单退回原因"
      show-word-limit
    />
    </div>
  </van-dialog>
</template>

<script>
import { Dialog, Toast } from "vant";
import { get } from "../../../../../public/API/query";
export default {
  data() {
    return {
      isShow: false,
      message: "",
      order_id: null,
    };
  },
  props:{
    Show:{
      type:Boolean
    }  
  },
  methods: {
    show(id) {
      this.order_id = id;
      this.isShow = true;
    },
    onBeforeClose(action,done){
      if(action == 'confirm'){
        if(this.Show){
        if(this.message== ''){
          Toast.fail('退单理由不能为空')  
          done(false)
        }else{
          this.submitOrder(); 
          done(); 
        }
        }else{
          this.submitOrder(); 
          done();   
        }
      }else{
        done()
      }
  },
  submitOrder(){
    let params = {
      id:this.order_id,
     }
    this.message == ''?'':params.remark = this.message
      get('applyChargeback',params,(res) => {
        if(res.code == 200){      
          Dialog({ message:'已提交取消订单申请，请耐心等待，如有问题请联系: 付艺源，联系电话：13237126506'})
          this.$router.push({
            path:'/user/home'  
          })  
          }else{
            Toast.fail(res.data)
          } 
      })  
  },
  }
};
</script>

<style lang='less'>
.orderCancel {
  .van-dialog__content {
    padding-top: 20px;
    height: 200px;
  }
  .select {
    width: 90%;
    margin: 0 auto;
  }
  .title {
    width: 90%;
    margin: 0 auto;
  }
  .textarea {
    .van-cell__value {
      border: 1px #ccc solid;
      padding: 10px;
    }
  }
}
</style>



